میں ، ہم نے رنگ کی اصلاح کے بنیادی اصولوں کا تجربہ کیا اور تصاویر کو ترمیم کرتے وقت رنگوں کے ساتھ کام کرنے کی اہمیت کی وضاحت کی. اور رنگوں کا نظام، اور اس کے ساتھ ساتھ تصاویر سے اور ان کا استعمال واحد بصری سٹائل بنانے کے لئے. اس سلسلے کا پہلا حصہ RGB LAB extracting palettes جیسا کہ ہم نے گزشتہ مضمون میں دیکھا ہے، کچھ رنگوں اور پائلٹوں کو ہم ابتدائی طور پر توقع سے مختلف طریقے سے دکھایا گیا تھا. یہ اس حقیقت کی وجہ سے ہے کہ ہم سب سے زیادہ سادہ آلات کا استعمال کرتے ہیں - RGB ماڈل اور Euclidean فاصلے کا حساب. سب سے پہلے، تھوڑا سا نظریہ. The RGB Model دو سب سے زیادہ مقبول رنگ کے ماڈل - اور - بنیادی طور پر مختلف ہیں کہ وہ رنگوں کی نمائندگی اور پروسیسنگ کیسے کرتے ہیں. RGB LAB کے ماڈل استعمال کرتا ہے ، اور  channels to represent colors. Each channel can have values ranging from 0 to 255, resulting in over 16 million possible colors. This model is ideal for working with images displayed on screens, as computer monitors, TVs, and smartphones all use this model. RGB Red Green Blue RGB Key Features: کے کے کے کے یہ ایک اضافی عمل کا استعمال کرتا ہے جہاں رنگوں کو سرخ، سبز اور نیلے روشنی کا مجموعہ کرتے ہوئے پیدا کیا جاتا ہے. یہ پیکسل کی سطح پر سمجھنے اور پروسیسنگ کرنے کے لئے آسان ہے. یہ تمام رنگوں کو درست طریقے سے نمائندگی کرنے کی صلاحیت میں محدود ہے، کیونکہ یہ رنگوں کی انسانی پہچان کی وضاحت نہیں کرتا. The LAB Model کے ماڈل تین چینلز میں رنگ کی نمائندگی کرتا ہے: ، اور یہ ماڈل یہ ہے کہ انسان رنگ کو کیسے دیکھتے ہیں اور ایک تصویر کے رنگ اور روشنی دونوں کا حساب کرتا ہے. LAB L (lightness) A (a color spectrum from green to red) B (a color spectrum from blue to yellow) LAB Key Features: کے کے کے کے 
 
 The   channel controls the brightness, allowing lightness adjustments without changing the color. L A اور B چینلز رنگوں کے رنگوں کی وضاحت کرتے ہیں، جو ایک وسیع رینج رنگوں پر زیادہ درست کنٹرول کی اجازت دیتا ہے. LAB ماڈل خاص طور پر پیشہ ورانہ رنگ کی درجہ بندی میں مفید ہے کیونکہ یہ زیادہ عام ہے اور دیگر تصاویر کے پیرامیٹرز کو متاثر کرنے کے بغیر درست رنگ کی ترتیبات کی اجازت دیتا ہے. لیب ماڈل میں، روشنیاں رنگ سے جدا ہوتی ہیں، جس سے تصویر کے بصری پیرامیٹرز کو اس کے رنگ کی توازن پر اثر انداز نہیں کیا جا سکتا. Color Calculation Algorithm and Using LAB To calculate and apply colors, our application utilizes the  لائبریری، جس میں LAB ماڈل میں رنگوں کے ساتھ مؤثر طریقے سے کام کرتا ہے. پروجیکٹ میں اس لائبریری کو منسلک کرنے کے لئے، ہم تصاویر کو پروسیسنگ کرتے وقت مطلوبہ نتائج کو حاصل کرنے میں مدد ملتی ہے کہ درست محاسبات کو انجام دینے کی اجازت دیتا ہے. colorjs.io یہاں LAB ماڈل میں رنگوں کے ساتھ کام کرنے کے لئے ہمارے ایپ میں استعمال ہونے والے کوڈ کا ایک مثال ہے: // Sample code for using colorjs.io in LAB model
const findClosestColor = (r, g, b) => {
  if (mode === "lab") {
    const color1 = new Color({ coords: [r / 255, g / 255, b / 255], space: "srgb" }).to("lab");
    let minDist = Infinity;
    let closest = [r, g, b];
    for (let i = 0; i < paletteLAB.length; i++) {
      const color2 = paletteLAB[i];
      const dist = color1.distance(color2);  // Calculating the distance between colors in LAB space
      if (dist < minDist) {
        minDist = dist;
        closest = palette[i];
      }
    }
    return closest;
  } else {
    // RGB calculations
    let minDist = Infinity;
    let closest = [r, g, b];
    for (let [pr, pg, pb] of palette) {
      const dist = Math.sqrt((r - pr) ** 2 + (g - pg) ** 2 + (b - pb) ** 2);
      if (dist < minDist) {
        minDist = dist;
        closest = [pr, pg, pb];
      }
    }
    return closest;
  }
};
 اس کوڈ کے بکس کو ایک مخصوص پلے میں سب سے قریب رنگ کو تلاش کرنے کا طریقہ کار ہے، مقصد رنگ اور پلے میں رنگوں کے درمیان رنگ فاصلے کا حساب کرتے ہوئے. یا کے RGB LAB How This Works in Practice: کے کے کے لیب موڈ: لیب رنگ کی جگہ انسانی بصیرت کے ساتھ مطابقت کرنے کے لئے ڈیزائن کی جاتی ہے، کرومیٹک اجزاء (A اور B) سے روشنی (L) کو جدا کرتی ہے. RGB موڈ: RGB رنگ کی جگہ صرف سرخ، سبز، اور نیلے روشنی کی شدت سے رنگ کی نمائندگی کرتا ہے. اس موڈ میں، فاصلہ براہ راست رنگ کے معیار پر مبنی طور پر شمار کیا جاتا ہے، جس میں ذہنی درستگی کم ہوسکتی ہے، کیونکہ یہ انسانی رنگ کی پہچان کے تجاویز کا حساب نہیں کرتا. پیشہ ورانہ رنگ کی درجہ بندی اور تصویر کے پروسیسنگ میں، رنگوں کی مطابقت کی بنیاد پر یہ بہت فائدہ مند ہے کیونکہ یہ نمونہ کرتا ہے کہ انسانی آنکھ رنگوں کو کیسے دیکھتی ہے، جس سے زیادہ قدرتی اور بصری طور پر دلچسپ نتائج حاصل کرنے کی اجازت دیتا ہے. اس طریقہ کار کا استعمال کرتے ہوئے، ایپلی کیشن تصاویر پر رنگ پلے کو لاگو کرتے وقت بہتر مطابقت کو حاصل کرسکتے ہیں، جس سے چاہتے ہوئے سٹائل کے ساتھ رنگوں کو ملنے کے لئے آسان بناتا ہے. LAB Optimization Challenge: LAB Computation کے ساتھ کام کرنے کے لئے رنگ ماڈل کے ساتھ کام کرنے کے مقابلے میں بہت زیادہ کمپیوٹرنگ وسائل کی ضرورت ہوتی ہے یہ اس وجہ سے ہے کہ، LAB میں، ہر رنگ کو نہ صرف تین چینلز (RGB) کی طرف سے نمائندگی کیا جاتا ہے، بلکہ رنگ کے مرکبوں اور ان کے فاصلے کو حاصل کرنے کے لئے اضافی محاسبات بھی شامل ہیں. LAB RGB اس عمل کو بہتر بنانے کے لئے، ہم نے پیش کیا ‫‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ ،‬جیسے‪ موڈ میموری میں ذخیرہ کیا جاتا ہے، اور اگر تصویر تبدیل نہیں ہوا ہے تو، نظام پائلٹ کو دوبارہ شمار نہیں کرے گا. اس کے نتیجے میں، خاص طور پر کئی تصاویر پر پائلٹ کو لاگو کرنے کے دوران، پروسیسنگ کو اہم طور پر تیزی سے بڑھانے میں مدد ملتی ہے، پہلے سے طے شدہ اعداد و شمار کو دوبارہ استعمال کرتے ہوئے، بغیر مہنگی شماروں کو دوبارہ انجام دینے کی ضرورت نہیں ہے. palette caching LAB // Optimization with palette caching
const extractPalette = () => {
  if (!image || image === lastExtractedImageRef.current) return;  // Check for changes

  const img = new Image();
  img.src = image;
  img.onload = () => {
    const canvas = document.createElement("canvas");
    const ctx = canvas.getContext("2d");
    canvas.width = img.width;
    canvas.height = img.height;
    ctx.drawImage(img, 0, 0);

    const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height).data;
    const colorMap = new Map();

    // Creating a color map
    for (let i = 0; i < imageData.length; i += 4) {
      const key = `${imageData[i]},${imageData[i + 1]},${imageData[i + 2]}`;
      colorMap.set(key, (colorMap.get(key) || 0) + 1);
    }

    const sorted = Array.from(colorMap.entries()).sort((a, b) => b[1] - a[1]);
    const topRaw = sorted.map(([str]) => str.split(",").map(Number));
    const topColors = filterColors(topRaw).slice(0, 10);

    const randomId = Math.floor(10000 + Math.random() * 90000);
    const name = `Palette_${randomId}`;

    setPalettes(prev => ({ ...prev, [name]: topColors }));
    setSelectedPalette(name);
    lastExtractedImageRef.current = image;  // Saving cache
  };
};
 یہ بہتر طریقہ کار ایپلی کیشن کی کارکردگی کو تیز کرنے میں مدد ملتی ہے، خاص طور پر کئی اسی طرح کے تصاویر کو دوبارہ پروسیسنگ کرتے وقت. Palette Extraction and Application پیلاٹ نکالنے ایک تصویر سے سب سے زیادہ خصوصی اور زندہ رنگوں کی شناخت کا عمل ہے، جس کا بعد میں فلٹرز یا بصری سٹائل بنانے کے لئے استعمال کیا جا سکتا ہے. رنگ کی صورت حال اور اس کے ، اس بات کو یقینی بنائیں کہ پلے پالٹ میں وہ رنگ شامل نہیں ہوتے جو ایک دوسرے کے ساتھ بہت مختلف ہیں. frequency luminance پائلٹ کو نکالنے کے لئے بنیادی میکانیزم یہ ہے کہ: const extractPalette = () => {
  // Check for image changes
  if (!image || image === lastExtractedImageRef.current) return;

  const img = new Image();
  img.src = image;
  img.onload = () => {
    const canvas = document.createElement("canvas");
    const ctx = canvas.getContext("2d");
    canvas.width = img.width;
    canvas.height = img.height;
    ctx.drawImage(img, 0, 0);

    const imageData = ctx.getImageData(0, 0, canvas.width, canvas.height).data;
    const colorMap = new Map();

    // Counting the frequency of occurrence of each color
    for (let i = 0; i < imageData.length; i += 4) {
      const key = `${imageData[i]},${imageData[i + 1]},${imageData[i + 2]}`;
      colorMap.set(key, (colorMap.get(key) || 0) + 1);
    }

    // Sorting by frequency and filtering similar colors
    const sorted = Array.from(colorMap.entries()).sort((a, b) => b[1] - a[1]);
    const topRaw = sorted.map(([str]) => str.split(",").map(Number));
    const topColors = filterColors(topRaw).slice(0, 10);  // Segmentation and filtering

    const randomId = Math.floor(10000 + Math.random() * 90000);
    const name = `Palette_${randomId}`;

    // Saving the palette
    setPalettes(prev => ({ ...prev, [name]: topColors }));
    setSelectedPalette(name);
    lastExtractedImageRef.current = image;
  };
};
 اس کوڈ کو ایک تصویر سے پلےٹ نکالنے کے لئے استعمال کیا جاتا ہے، جہاں رنگ روشنی اور فرق کی طرف سے فلٹر کیا جاتا ہے. اس میکانیزم کے ساتھ، آپ کو فوری طور پر مزید درخواست کے لئے سب سے زیادہ نمائندہ رنگوں کو جمع کر سکتے ہیں. ہم نے غیر ضروری بٹنوں کے ساتھ صارف کے انٹرفیس کو گڑبڑ کرنے سے بچنے کے لئے نکالنے والے پلے کے لئے خود کار طریقے سے نام پیدا کرنے کا اضافہ کیا ہے. Custom Palettes ہمارے ایپلی کیشن میں آلے میں سے ایک اپنی مرضی کے ساتھ pallet creation بلاک ہے.This feature allows users to create pallets suitable for various projects, providing full control over colors. The process starts with selecting a color through the  صارف تصویر سے یا ایک بیرونی ذریعہ سے ایک رنگ منتخب کر سکتا ہے. ہر منتخب رنگ صارف کے رنگ کی فہرست میں خود کار طریقے سے شامل کیا جاتا ہے، جس سے ایک پلاٹ پیدا ہوتا ہے. HexColorPicker چند رنگوں کو منتخب کرنے کے بعد، پلاسٹ کو اپنی مرضی کے نام کے ساتھ محفوظ کیا جا سکتا ہے. بعد میں، یہ ایک مخصوص بصری سٹائل حاصل کرنے کے لئے اپ لوڈ کردہ تصویر پر لاگو کیا جا سکتا ہے. Color Neutralization with Color Palettes رنگوں کے پلے کے ساتھ رنگوں کی نائٹرائزیشن ایک اہم پہلو ہے اس میں اہم کردار ادا کرتا ہے یہ وہ عمل ہے جس میں انفرادی منظر یا تصاویر، مختلف روشنی کے حالات کے تحت لیا جا سکتا ہے، ایک مشترکہ رنگ ٹون میں لے جا سکتا ہے. یہ عام طور پر فلم کے دوران ایک واحد بصری سٹائل کو یقینی بنانے کے لئے کیا جاتا ہے اور تصاویر کو بصری طور پر مطابقت رکھتا ہے. Color neutralization color grading film post-production ہم فلمی بصری زبان کے دو مشہور مثالوں کے ذریعے پلےٹس کو کس طرح لاگو کیا جاتا ہے کا تجربہ کریں. Palettes in the Movie “The Matrix” فلم (1999)، Wachowski بھائیوں کی طرف سے ڈیزائن کیا گیا، اس کی منفرد بصری سٹائل کی وجہ سے مشہور ہوا، جس میں ایک مخصوص سبز رنگ پلے شامل ہے. یہ رنگ سٹائل ڈیزائن کیا گیا تھا جس میں ڈیجیٹل حقیقت جس میں اہم کردار موجود ہیں. “The Matrix” سبز، سیاہ، دھاتی Main Colors Palette Application: کے کے کے سبز ٹونز نکالنے: ایک مٹریکس سٹائل پلے کا تخلیق کرنے کے لئے، ہم تصاویر سے تمام سبز، سیاہ اور گرے رنگوں کو نکال سکتے ہیں. ان ٹونز کو استعمال کرتے ہوئے، ہم فلم کی "ڈیجیٹل حقیقت" اثر کی خصوصیات کو حاصل کرسکتے ہیں. نئے تصاویر کے لئے لاگو: جب ہم اس پلے پالٹ کو لاگو کرتے ہیں تو، تصاویر کے رنگ بدل جائیں گے، پےکسل کو پلے پالٹ سے منتخب کردہ رنگوں کے قریب ترین رنگوں کے ساتھ تبدیل کریں گے، اس طرح مطلوبہ "کوڈ" سٹائل بنائیں. Palettes in Wes Anderson’s Works اس کی روشن، رنگارنگ، اور متبادل بصری حل کے لئے جانا جاتا ہے. کے اور ہر ایک کے اپنے دستخط سٹائل ہے، جس میں امیر پیسٹل رنگوں اور احتیاط سے منتخب شدہ پلے ٹکڑے ہیں. ان کی فلموں کا ایک اہم عنصر رنگ ڈیزائن میں ہارمون اور تنازع ہے. Wes Anderson “The Grand Budapest Hotel”, “Moonrise Kingdom”, “The French Dispatch”, : پیسٹل رنگوں، روشن متضاد رنگوں، سرخ، زرد، ترکیب، سبز. Main Colors Palette Application: کے کے کے Pastel Shades نکالنے: Wes Anderson کی فلموں میں، پیسٹل رنگوں کو اکثر استعمال کیا جاتا ہے. مثال کے طور پر، روشنی کے بالغ، نیلے، اور نوری رنگ. ہم ان رنگوں کو نکال سکتے ہیں اور ان کو ایک نیا تصویر پر لاگو کرنے کے لئے ایک اثر پیدا کرنے کے لئے vintage تصویر کی طرح یا ایک سٹائل شدہ ماحول پر توجہ مرکوز کرنے کے لئے. ہماری اپلی کیشن میں، ہم صرف نرم پیسٹل رنگوں کو برقرار رکھنے کے لۓ روشنی اور تنازعہ کی طرف سے رنگوں کو فلٹرنگ کی طرف سے تصویر سے پلےٹ نکال سکتے ہیں. نئے تصاویر کے لئے لاگو: پلے پالٹ نکالنے کے بعد، یہ کسی بھی تصویر پر لاگو کیا جا سکتا ہے، اس کی خصوصیات کو ایڈسن کے کاموں کی یاد دہانی کرتا ہے، روشنی میں لیکن ہیرو رنگوں کے ساتھ. اب کہ ہم حوالہ جات سے پلاسٹ نکال سکتے ہیں، کچھ تجربات کے لئے وقت ہے! کیونکہ ہم رنگوں کی تعداد میں محدود پلے کا استعمال کرتے ہیں اور براؤزر میں ہمارے ایپلی کیشن کو چلانے کے لئے ہیں (جو محدود کمپیوٹر وسائل کا استعمال کرتے ہیں) ہم غیر معمولی نتائج کی توقع نہیں کرنا چاہئے. یہاں RGB اور LAB موڈ دونوں میں پروسیسنگ شدہ تصاویر کے مثالیں ہیں. پلاٹس کو نکالنے اور لاگو کرنے کا ایک اہم پہلو بصری سٹائلوں کی تخلیق کے طور پر ہے، جیسے "مٹریکس" سٹائل، Wes Anderson کی، یا Denis Villeneuve کی. ہماری اپلی کیشن رنگوں کے ساتھ کام کرنے کے لئے ایک بصری آلے فراہم کرتا ہے جو صارفین کو پلاٹس نکالنے، ان کو لاگو کرنے اور منفرد بصری اثرات پیدا کرنے کی اجازت دیتا ہے. اس کے ساتھ، آپ آسانی سے تصاویر کو سٹائل کرسکتے ہیں اور مقبول فلموں میں دیکھے جانے والی بصری نظر پیدا کرسکتے ہیں. آخر میں، ہم رنگوں کو بہتر بنانے اور بہتر بنانے پر توجہ مرکوز کریں گے.

Read My Stories

یہ آڈیو کہانی کی اصل زبان میں تیار کی گئی ہے!

بہت لمبا؛ پڑھنے کے لئے

Make resilience your competitive advantage

یہ رنگ آلہ کسی بھی تصویر کو ویز اینڈرسن گرمی کے خواب میں تبدیل کرتا ہے

About Author

تبصرے

ہینگ ٹیگز

یہ مضمون اس میں پیش کیا گیا تھا۔

Related Stories

Urbain Grandier by Alexandre Dumas - Table of Links

HackerNoon Decoded: The Top 10 Countries Where HackerNoon Is the Most Active

"Growing Businesses Gives Me a Sense of Purpose." says Flow Ninja Founder/CEO

On Sunday, the 26th of November, 1631

Urbain Grandier by Alexandre Dumas - Table of Links

HackerNoon Decoded: The Top 10 Countries Where HackerNoon Is the Most Active

"Growing Businesses Gives Me a Sense of Purpose." says Flow Ninja Founder/CEO

On Sunday, the 26th of November, 1631

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps